<template>
    <div class="box">
        <header>
            <!-- 顶部导航栏 -->
            <van-nav-bar title="嗨购登录" @click-left="$router.back()">
                <template #left>
                    <van-icon name="arrow-left" size="25" color="black" />
                </template>
            </van-nav-bar>
        </header>
        <main>
            <van-cell-group border>
                <van-field v-model="oldPass" :type="flag1 ? 'password' : 'text'" label="旧密码"
                    @click-right-icon='flag1 = !flag1' placeholder="请输入旧密码" autofocus
                    :right-icon="flag1 ? 'closed-eye' : 'eye-o'" />
            </van-cell-group>
            <!-- 密码 -->
            <van-cell-group border>
                <van-field v-model="newPass" :type="flag ? 'password' : 'text'" label="新密码"
                    @click-right-icon='flag = !flag' placeholder="请设置新密码" :right-icon="flag ? 'closed-eye' : 'eye-o'" />
            </van-cell-group>
            <!-- 登录按钮 -->
            <div class="loginbutton">
                <van-button round type="danger" block @click="update" :disabled='btnFlag'>完成</van-button>

            </div>
        </main>
    </div>
</template>

<script>
import { Toast } from 'vant'
import { doUpdatePass } from '../api/user'
export default {
    data() {
        return {
            oldPass: '',
            newPass: '',
            flag: false,
            flag1: false,
        }
    },
    methods: {
        update() {
            doUpdatePass({ userid: localStorage.getItem('userid'), oldpassword: this.oldPass, newpassword: this.newPass }).then(res => {
                switch (res.data.code) {
                    case '10030':
                        Toast('原始密码错误')
                        break;
                    case '200':
                        Toast('密码修改成功')
                        this.$router.push('/home')
                        break;

                    default:
                        break;
                }
            })
        }
    },
    computed: {
        btnFlag() {
            if (/^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])\S*$/.test(this.newPass) && this.oldPass.trim() != '') {
                return false
            } else {
                return true
            }
        }
    }
}
</script>

<style>

</style>